@import "../../scss/var";
@import "../../scss/mixin";

page {
  background-color: $them;
}

.list-container{
  padding: 0 25px;
}

.record-list-container{
  @include container;
  margin: 50px auto;
  background-color: #fff;
  overflow: hidden;
  .record-list-wrapper{
    .title{
      display: flex;
      height: 86px;
      justify-content: space-between;
      align-items: center;
      .date{
        position: relative;
        display: flex;
        align-items: center;
        font-weight: bold;
        font-size: 36px;
        line-height: 1;
        color: $them;
        .arrow-container{
          position: relative;
          height: 40px;
          width: 40px;
        }
        .arrow{
          position: absolute;
          top: 10rpx;
          left: 0;
          right: 0;
          bottom: 0;
          margin: auto;
          height: 0;
          width: 0;
          border: 10px solid transparent;
          border-top-color: #bebebe;
        }
      }
      .sum{
        font-size: 24px;
        color: #999;
      }
    }

    .statement-container{
      display: flex;
      justify-content: space-between;
      align-items: center;
      width: 100%;
      height: 100px;
      border-bottom: 2px dashed #bebebe;
      .detail-container{
        flex: auto;
        .detail{
          font-size: 28px;
          line-height: 1;
          color: $black-title;
        }
        .time{
          margin-top: 15px;
          font-size: 20px;
          color: #999999;
        }
      }
      .money-container{
        .img{
          display: inline-block;
          height: 24px;
          width: 24px;
          vertical-align: middle;
        }
      }
    }
  }
  .no-data {
    padding: 30px;
  }
}

.tips{
  line-height: 80px;
  font-size: 24px;
  text-align: center;
  color: #999;
}

.at-tabs__item-underline {
  height: 6px;
}
.at-accordion__info__title{
  max-width: 650px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.at-tabs__header{
  margin: 0 auto;
  justify-content: center;
}
.at-tabs__item{
  color: #999;
  padding: 30px 0;
  flex: 0 0 132px;
  &:not(:last-child) {
    margin-right: 66px;
  }
}
.at-tabs__item--active {
  color: $them;
}

.balance-container{
  padding: 0 25px;
  width: 100%;
  height: 88px;
  line-height: 88px;
  background-color: #f4f4f4;
  font-size: 28px;
  color: #999999;
}
